import React, { Component } from 'react';
import BasePage from "@/components/Layout/BasePage";
// import ComponentToPrint from "./SuratBA";
// import ComponentToPrint from "../../components/sanksi/SuratBA";
import { getOneLaporan, updateLaporan } from "@/actions/pelaporan";
import { withRouter } from 'next/router';
import { getOneLaporanPublic } from '../../../actions/public';
import { getAutoSave } from "@/actions/autosave";



class PlenoSanksi extends Component {
    constructor(props) {
        super(props);
        this.state = {
            dataLaporan: {},
        }
    }
    static getInitialProps = async ({ query }) => {
        return { query };

    };

    componentDidMount = async () => {
        const { query } = this.props;
        const { id } = query;
        const dataLaporan = await getOneLaporanPublic(id);
        const getDataSave = await getAutoSave({ id, laporan: true });
        const dataSuratBA = getDataSave.data?.PenetapanSanksi?.dataSuratBA;
        const dataPelanggaran = getDataSave.data?.PenetapanSanksi?.dataPelanggaran.data;
        this.setState({ dataLaporan, dataSuratBA, dataPelanggaran });
    };




    render() {
        const { dataPelanggaran, dataLaporan, dataSuratBA } = this.state
        console.log(dataPelanggaran)

        return (
            <div className='page'>
                <div className='BA-logo'>
                    <img className='BA-logo' src="/static/img/logo-single-1-login.png" alt="logo" />
                </div>
                <h3 className='BA-header'>LAPORAN HASIL EVALUASI DAN PEMBAHASAN</h3>
                {dataLaporan.data && (<h3 className='BA-header'>{dataLaporan.data.pt.nama}</h3>)}
                <div className='body'>
                    <p className='body'>
                        Pada hari ini
                        {dataSuratBA?.setTanggal === true ?
                            <span > {moment(dataSuratBA.tanggal).locale("id").format("dddd")}, tanggal&nbsp;{moment(dataSuratBA.tanggal).format("D")}&nbsp;bulan&nbsp;{moment(dataSuratBA.tanggal).locale("id").format("MMMM")} tahun &nbsp;{moment(dataSuratBA.tanggal).format("YYYY")},</span> :
                            <span> &nbsp;......................... &nbsp;</span>
                        }
                        &nbsp;bertempat di
                        {dataSuratBA?.tempat === "[Mohon Diisi]" ?
                            <span>Belum Diisi Oleh Dikti</span>
                            :
                            <span>
                                &nbsp;{dataSuratBA?.tempat}
                            </span>
                        }
                        ,
                        telah dilakukan rapat evaluasi dan pembahasan dugaan pelanggaran penyelenggaraan oleh perguruan tinggi dan/atau badan penyelenggara {dataLaporan.data && (<span>{dataLaporan.data.pt.nama}</span>)}, yang dihadiri oleh:

                    </p>
                    <div className='BA-body'>
                        <ol>
                            {dataSuratBA?.namaPeserta ?
                                <span>
                                    {dataSuratBA.namaPeserta.map((value) => <li>{value}</li>)}
                                </span>
                                :
                                <span>........</span>
                            }

                        </ol>
                    </div>
                </div>
                <p>
                    Berdasarkan rapat evaluasi dan pembahasan dugaan pelanggaran penyelenggaraan oleh perguruan tinggi dan/atau badan penyelenggara {dataLaporan.data && (<span>{dataLaporan.data.pt.nama}</span>)}, disampaikan sebagai berikut:
                </p>
                <div className='body'>
                    <ol>
                        <li>Telah dibacakan Berita Acara Evaluasi Kinerja Perguruan Tinggi {dataLaporan.data && (<span>{dataLaporan.data.pt.nama}</span>)}, tanggal
                            {dataSuratBA?.setTanggal === true ?
                                <span> &nbsp;{moment(dataSuratBA.tanggal).format("DD-MM-YYYY")}</span>
                                :
                                <span> &nbsp;....... &nbsp;</span>
                            }</li>
                        <li>Telah dilakukan pembahasan rekomendasi mengenai fakta-fakta yang ditemukan Tim EKPT Ditjen Diktiristek, dengan temuan sebagai berikut:</li>
                        <table className='table-a'>
                            <thead>
                                <tr>
                                    <th rowspan="2">NO</th>
                                    <th rowspan="2">NAMA DAN IZIN PRODI</th>
                                    <th colspan="3">PELANGGARAN TERHADAP PERMENDIKBUD NO.7 TAHUN 2020</th>
                                    <th rowspan="2">SIMPULAN</th>
                                    <th rowspan="2">REKOMENDASI</th>
                                </tr>
                                <tr>
                                    <th>PASAL</th>
                                    <th>BUTIR PELANGGARAN</th>
                                    <th>DESKRIPSI PELANGGARAN</th>
                                </tr>
                            </thead>
                            <tbody>
                                {dataPelanggaran
                                    ? dataPelanggaran.map((e, i) => (
                                        <tr key={e._id}>
                                            <td>{++i}</td>
                                            {dataLaporan.data && (<td className='BA-header'>{dataLaporan.data.pt.nama}</td>)}
                                            <td>{e.pasal}</td>
                                            <td>{e.butir_pelanggaran}</td>
                                            <td>{e.pelanggaran}</td>
                                            <td >[Mohon Diisi]</td>
                                            <td >[Mohon Diisi]</td>
                                        </tr>

                                    ))
                                    : ""}
                            </tbody>
                        </table>
                        <li>Temuan Lain:
                            <ol type="a">
                                {dataSuratBA?.temuanLain ?
                                    <span>{dataSuratBA.temuanLain.map((value) => <li>{value}</li>)}</span>
                                    : "Belum Diisi"}
                            </ol>
                        </li>
                        <li>Hal-hal yang memberatkan, sebagai berikut:
                            <ol type="a">
                                {dataSuratBA?.memberatkan ?
                                    <span>{dataSuratBA.memberatkan.map((value) => <li>{value}</li>)}</span>
                                    : "Belum Diisi"}
                            </ol>
                        </li>
                        <li>hal-hal yang meringankan, sebagai berikut:
                            <ol type="a">
                                {dataSuratBA?.meringankan ?
                                    <span>{dataSuratBA.meringankan.map((value) => <li>{value}</li>)}</span>
                                    : "Belum Diisi"}
                            </ol>
                        </li>
                        <li>
                            Berdasarkan pembahasan yang dilakukan, disepakati untuk merekomendasikan <strong >“Sanksi Administratif berupa&nbsp;
                                {dataSuratBA?.sanksi === "[Mohon Diisi]" ?
                                    "Belum Diisi Oleh Dikti"
                                    : <span>{dataSuratBA?.sanksi}</span>}
                                ”.</strong>
                        </li>
                    </ol>
                </div>
                <p className='body'>
                    Demikian Laporan Evaluasi dan Pembahasan ini dibuat dengan sesungguhnya dan telah dibaca dan dicermati oleh peserta rapat yang hadir.
                </p>
            </div>
        );
    }

}

PlenoSanksi.Layout = BasePage;
export default PlenoSanksi;